<div class="navbar">
    <div class="container">
        <div class="navbar-inner">
            <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
            <a class="btn btn-navbar" data-toggle="collapse" data-target=".navbar-responsive-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>

            <!--<a class="brand" href="#">操作项</a>-->

            <div class="nav-collapse collapse navbar-responsive-collapse">
                <ul class="nav">
                    <li><a href="#"><i class="icon-search icon-print"></i> 批量打印</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-search icon-download-alt"></i> 批量导出 <b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">CSV格式</a></li>
                            <li><a href="#">Excel2000</a></li>
                            <li><a href="#">txt制表符</a></li>
                            <li><a href="#">CSV逗号分割</a></li>
                        </ul>
                    </li>
                    <li><a href="#"><i class="icon-search icon-trash"></i> 批量删除</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-search icon-list"></i> 快速筛选 <b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">全部订单</a></li>
                            <li><a href="#">等待付款</a></li>
                            <li><a href="#">已付款未发货</a></li>
                            <li><a href="#">已发货</a></li>
                            <li><a href="#">已完成</a></li>
                            <li><a href="#">已退款</a></li>
                            <li><a href="#">已退货</a></li>
                            <li><a href="#">已作废</a></li>
                            <li><a href="#">回收站</a></li>
                        </ul>
                    </li>
                    <!--<li class="divider-vertical"></li>-->
                    <li><a href="#"><i class="icon-search icon-wrench"></i> 其他设置</a></li>
                </ul>

                <form class="navbar-form pull-right" action="###">
                    <div class="input-prepend input-append">
                        <div class="btn-group">
                            <button class="btn dropdown-toggle" data-toggle="dropdown">
                                订单号 <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu">
                                <li><a href="#">来源单号</a></li>
                                <li><a href="#">货号</a></li>
                                <li><a href="#">商品名称</a></li>
                                <li><a href="#">物流单号</a></li>
                                <li><a href="#">会员名</a></li>
                                <li><a href="#">收货人</a></li>
                            </ul>
                        </div>
                        <input type="text" class="span5" placeholder="搜索订单">
                        <button type="submit" class="btn"><i class="icon-search"></i> 搜索</button>
                        <button type="button" class="btn" data-toggle="modal" role="button" data-target="#myModal" >高级搜索</button>
                    </div>
                </form>

            </div>
        </div>
    </div>
</div>

<!--列表区域-->
<table class="table table-striped table-hover">
    <thead>
        <tr>
            <th><input type="checkbox"></th>
            <th>操作</th>
            <th>打印 <a href="###" data-toggle="tooltip" title="按钮分别为打印：购物清单、配送单、快递单"><i class="icon-question-sign"></i></a></th>
            <th>订单号</th>
            <th>下单日期</th>
            <th>订单总额</th>
            <th>收货人</th>
            <th>付款状态</th>
            <th>发货状态</th>
            <th>配送方式</th>
            <th>支付方式</th>
            <th>会员名</th>
        </tr>
    </thead>
    <tbody>
    <for start="0" end="15">
        <tr>
            <td><input type="checkbox"></td>
            <td>
                <div class="btn-group">
                    <a href="###" class="btn btn-primary btn-small">编辑</a>
                    <a href="###" class="btn btn-warning btn-small">删除</a>
                </div>
            </td>
            <td>
                <div class="btn-group">
                    <a href="###" class="btn btn-primary btn-small"><i class="icon-print icon-white"></i> 购</a>
                    <a href="###" class="btn btn-primary btn-small">配</a>
                    <a href="###" class="btn btn-primary btn-small">递</a>
                </div>
            </td>
            <td>1000023123</td>
            <td>2013-07-28</td>
            <td>￥1023.88</td>
            <td>张三</td>
            <td><span class="label label-success">已付款</span></td>
            <td><span class="label label-warning">未发货</span></td>
            <td>圆通快递</td>
            <td>预存款</td>
            <td>zhangsan</td>
        </tr>
    </for>
</tbody>
<tfoot>
    <tr>
        <td colspan="99">
            <div class="pagination">
                <ul>
                    <li><a href="#">首页</a></li>
                    <li><a href="#">上一页</a></li>
                    <li class="active"><a href="#">1</a></li>
                    <li><a href="#">2</a></li>
                    <li><a href="#">3</a></li>
                    <li><a href="#">4</a></li>
                    <li><a href="#">5</a></li>
                    <li><a href="#">下一页</a></li>
                    <li><a href="#">尾页</a></li>
                </ul>
            </div>
        </td>
    </tr>
</tfoot>
</table>


<!--弹出对话框-->

<div id="myModal" class="modal hide fade">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h3>高级搜索</h3>
    </div>
    <div class="modal-body">
        <p>内容等等…</p>
    </div>
    <div class="modal-footer">
        <a href="#" class="btn" data-dismiss="modal" aria-hidden="true">关闭</a>
        <a href="#" class="btn btn-primary">搜索</a>
    </div>
</div>

<script>
    $(document).ready(function(){
        $('a').tooltip();
    });
</script>